<template>
  <div class="homeIndex indexChild" data-v-1712b3c9 data-v-37dffbed>
    <section class="topSearchBanner" data-v-1712b3c9>
      <!-- 搜索 -->
      <IndexSearch></IndexSearch>
      <div class="banner" data-v-1712b3c9>
        <div class="el-carousel" data-v-1712b3c9>
          <div class="el-carousel__container">
            <button
              type="button"
              class="el-carousel__arrow el-carousel__arrow--left"
              style="display:none;"
            >
              <i class="el-icon-arrow-left"></i>
            </button>
            <button
              type="button"
              class="el-carousel__arrow el-carousel__arrow--right"
              style="display:none;"
            >
              <i class="el-icon-arrow-right"></i>
            </button>
          </div>
          <div
            data-v-1712b3c9
            class="el-carousel__item is-active is-animating"
            style="transform: translateX(0px) scale(1);"
          >
            <!---->
            <a data-v-1712b3c9 target="_blank">
              <img
                data-v-1712b3c9
                src="http://baoyitech.oss-cn-hangzhou.aliyuncs.com/1558012796394c0ef7e27b116b088d15d845f69b3af2a"
                alt="bannerImg"
                class="bannerImg"
              />
            </a>
          </div>
        </div>
      </div>
    </section>
    <section class="bannerTagBox" data-v-1712b3c9>
      <div class="mainBox" data-v-1712b3c9>
        <div class="filterBoxWrap" data-v-1712b3c9>
          <div class="headTipsBox" data-v-1712b3c9>
            <i class="iconfont iconfenlei" data-v-1712b3c9></i>
            <span data-v-1712b3c9>商品分类</span>
          </div>
          <ul data-v-1712b3c9 class="filterRow">
            <li data-v-1712b3c9 class @click="lisdata('1')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>一毛专区</strong>
                  <span data-v-1712b3c9>比你再便宜一点儿</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(253, 26, 26);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(253, 26, 26);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(255, 74, 74), rgb(253, 26, 26));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class @click="lisdata('2')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>新品专区</strong>
                  <span data-v-1712b3c9>精彩生活一点新</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(255, 126, 35);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(255, 126, 35);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(255, 149, 74), rgb(255, 126, 35));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class @click="lisdata('3')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>配重专区</strong>
                  <span data-v-1712b3c9>合理配重轻松下单</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(255, 182, 22);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(255, 182, 22);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(255, 198, 74), rgb(255, 182, 22));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class="isLast" @click="lisdata('4')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>高端精品</strong>
                  <span data-v-1712b3c9>为你找到最合适的</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(5, 197, 74);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(5, 197, 74);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(42, 211, 90), rgb(5, 197, 74));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class @click="lisdata('5')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>畅销专区</strong>
                  <span data-v-1712b3c9>热销单品轻松购物</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(5, 197, 185);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(5, 197, 185);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(42, 211, 190), rgb(5, 197, 185));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class @click="lisdata('6')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>厨卫用品</strong>
                  <span data-v-1712b3c9>打造梦想中的生活</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(21, 176, 255);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(21, 176, 255);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(74, 194, 255), rgb(74, 194, 255));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class @click="lisdata('7')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>办公用具</strong>
                  <span data-v-1712b3c9>今天也要努力工作哦</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(21, 153, 255);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(21, 153, 255);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(74, 176, 255), rgb(21, 153, 255));"
                  ></em>
                </div>
              </a>
            </li>
            <li data-v-1712b3c9 class="isLast" @click="lisdata('8')">
              <a data-v-1712b3c9 href="javascript:;" class="linkBox">
                <div data-v-1712b3c9 class="tagNameDetail">
                  <strong data-v-1712b3c9>家具日用</strong>
                  <span data-v-1712b3c9>选你喜欢的生活方式</span>
                </div>
                <div data-v-1712b3c9 class="goTag">
                  <div data-v-1712b3c9 class="tagGo">
                    <span data-v-1712b3c9 style="color: rgb(21, 61, 255);">GO</span>
                    <i data-v-1712b3c9 class="iconfont iconright" style="color: rgb(21, 61, 255);"></i>
                  </div>
                  <em
                    data-v-1712b3c9
                    class="borders"
                    style="background: linear-gradient(to right, rgb(74, 105, 255), rgb(21, 61, 255));"
                  ></em>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </section>
    <section class="hotNewBoxAll" data-v-1712b3c9>
      <div class="mainBox" data-v-1712b3c9>
        <div class="hotBox" data-v-1712b3c9>
          <div class="titles" data-v-1712b3c9>
            <img
              src="../assets/picture/15578794260000dffc4de154e82b1a75.jpg"
              alt="热销单品"
              class="titleImg"
              data-v-1712b3c9
            />
            <span data-v-1712b3c9>多种商品满足你的需求</span>
          </div>
          <div class="hotProduct" data-v-1712b3c9>
            <div class="topHotIteFirst" data-v-1712b3c9>
              <img
                src="../assets/picture/155790081965413cdb71f58255a6ba90.jpg"
                alt="每日更新新品上市"
                class="dayHotImg"
                data-v-1712b3c9
              />
            </div>
            <!-- 热销单品 -->
            <HotsSaleGoods></HotsSaleGoods>
          </div>
        </div>
        <div class="newBox" data-v-1712b3c9>
          <div class="titles" data-v-1712b3c9>
            <img
              src="../assets/picture/155787942600006de79cb686b528272f.jpg"
              alt="热销单品"
              class="titleImg"
              data-v-1712b3c9
            />
            <span data-v-1712b3c9>我们上新啦</span>
          </div>
        <!-- 新品 -->
          <NewSale></NewSale>
        </div>
      </div>
    </section>
  </div>
</template>

<script>
import IndexSearch from '@/components/IndexSearch'
import HotsSaleGoods from '@/components/HotsSaleGoods'
import NewSale from '@/components/NewSale'
export default {
  components:{
    IndexSearch,
    HotsSaleGoods,
    NewSale
  },
  data() {
    return {
      list:1
    }
  },
  methods: {
    lisdata(id){
      this.$router.push({
          path:'/giftmall/'+id
      })
    }
  },
};
</script>

<style>
.NoticeBox {
  display: flex;
  background: #fafafa;
}
.NoticeBox img {
  width: 40px;
  padding: 10px;
}
.NoticeBox ul {
  border-left: 1px solid #ccc;
  margin: 8px;
}
</style>